<template>
  <div>
    <ZWDrawer ref="zwRef" @close="close">
      <div class="content">
        <el-radio-group v-model="StatusName" style="margin-bottom: 10px">
          <el-radio-button label="0">未转化</el-radio-button>
          <el-radio-button label="1">已转化</el-radio-button>
          <el-radio-button label="2">已放弃</el-radio-button>
        </el-radio-group>
        <div v-if="StatusName == 0"><OneTable /> </div>
        <div v-if="StatusName == 1"><TwoTable /></div>
        <div v-if="StatusName == 2"><ThreeTable /></div>
      </div>
    </ZWDrawer>
  </div>
</template>
<script lang="tsx" setup>
import { ref, reactive, watch } from 'vue'
import ZWDrawer from '@/components/ZWDrawer.vue'
import OneTable from './OneTable.vue'
import TwoTable from './TwoTable.vue'
import ThreeTable from './ThreeTable.vue'
import { flowData } from '@/api/customer/clubManage/commonSea'
import { deepCopy } from '@/utils/helper'
const emit = defineEmits(['close'])
const zwRef = ref(null)
const props = defineProps(['clubopen', 'rowid', 'title'])
const tableRef = (ref < HTMLElement) | (null > null)
const defaultParams = {}
const isopen = ref(false)
const StatusName = ref(0)
const state = reactive({
  searchParams: deepCopy(defaultParams)
})
let tableOption = [
  {
    type: 'index',
    width: 55,
    fixed: 'left'
  },
  {
    prop: 'operation_msg',
    label: '操作类型'
  },
  {
    prop: 'owner_before',
    label: '原归属人'
  },
  {
    label: '操作人',
    prop: 'created_user_name',
    width: 200
  },
  {
    prop: 'owner_after',
    label: '变更归属人'
  },
  {
    prop: 'created_at',
    label: '变更时间'
  }
]
const getids = () => {
  return new Promise((resolve) => {
    setTimeout(() => {
      resolve(props.rowid)
    }, 1)
  })
}
const close = () => {
  emit('close')
}
watch(
  () => props.clubopen,
  (val) => {
    if (val) {
      isopen.value = val
      zwRef.value.drawer = true
      zwRef.value.isShow = false
      zwRef.value.title = props.title
      zwRef.value.width = '800px'
    }
  }
)
</script>
<style scoped lang="scss">
.content {
  padding: 16px 0;
}
</style>
